<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>模拟vue</title>
</head>

<body>
    <div>
        1号-><span id="element" v-band='count'></span>
        <button v-no="click:add">+1</button>
        <button v-no="click:addmore">+10</button>
        <button v-no="click:del">-1</button>
        <button v-no="click:delmore">-10 </button>
        <button v-no="click:up">弹出</button>
    </div>
    <div>
        2号-><span id="element" v-band='ccc.a'></span>
        <button v-no="click:add2">+1</button>
        <button v-no="click:addmore2">+10</button>
        <button v-no="click:del2">-1</button>
        <button v-no="click:delmore2">-10 </button>
        <button v-no="click:up2">弹出2</button>
    </div>
    <script src="./ccc.js"></script>
    <script>
        const config = {
            data() {
                return {
                    count: 1,
                    ccc: {
                        a: 3,
                        b: 2
                    }
                }
            },
            beforeCreate() {
                console.log('->这是befcre');
            },
            created() {
                console.log('->这是created');
            },
            methods: {
                add() {
                    this.count++
                },
                addmore() {
                    this.count += 10
                },
                del() {
                    this.count--
                },
                delmore() {
                    this.count -= 10
                },
                up() {
                    alert('弹出')
                },
                add2() {
                    this.ccc.a++
                },
                addmore2() {
                    this.ccc.a += 10
                },
                del2() {
                    this.ccc.a--
                },
                delmore2() {
                    this.ccc.a -= 10
                },
                up2() {
                    alert('弹出2')
                }
            }
        }
        VUE(config)
    </script>
</body>

</html>